import React, { Component, PropTypes } from 'react';
import {
  Text,
  View,
  ScrollView
} from 'react-native';

import ScrollableTabView from 'react-native-scrollable-tab-view';
import styles from './orderFinishedStyle';
import OrderFinishedList from './orderFinishedList';
import ScrollableTabBar from '../global/scrollableTabView/ScrollableTabBar';

class OrderFinished extends Component {
    constructor(props) {
		super(props);

		this.state = {
			tab: 0
		};

		// this._getTabHeight = this._getTabHeight.bind(this);
		this._onChangeTab = this._onChangeTab.bind(this);
		// this.props.navigator.setOnNavigatorEvent(this._onNavigatorEvent.bind(this));
	}

    componentWillMount() {
		// this._retrieveDetails();

	}

    componentWillUnmount(){

    }

    _onNavigatorEvent(event) {
        // console.log("###", event);
        // if()
		// if (event.type === 'ScreenChangedEvent') {
		// 	if (event.id === 'didAppear') { // 出现时
        //         // this._onRefresh();
        //
		// 	}
		// }
	}

    _onChangeTab({ i, ref }) {
        // let page = this.props.page || 0;
		this.setState({ tab: i });
	}

    render() {

        return (
            <ScrollableTabView
                initialPage={this.props.page?this.props.page:0}
                onChangeTab={this._onChangeTab}
                renderTabBar={() => (
                    <ScrollableTabBar
                        ref={component => this.tabBar = component}
                        activeTextColor={"#EA5404"}
                        inactiveTextColor={"#555555"}
                        textStyle={styles.textStyle}
                        underlineStyle={styles.underlineStyle}
                        style={styles.tabBar}
                    />
                )}
                locked={true}>
                <OrderFinishedList
                    tabLabel="全部订单"
                    service_type={'all'}
                    navigator={this.props.navigator}/>
                <OrderFinishedList
                    tabLabel="已完成"
                    service_type={'fininsh'}
                    navigator={this.props.navigator}/>
                <OrderFinishedList
                    tabLabel="已取消"
                    service_type={'cancel'}
                    navigator={this.props.navigator}/>
        </ScrollableTabView>
        );
    }
}

var connectHelper = require('../../services/connectHelper');
OrderFinished = connectHelper(state => state)(OrderFinished);

module.exports = OrderFinished;
